<template>
  <div id="app">
    <router-view />

    <van-popup v-model="$store.showSignin" position="bottom" class="signin-popup">
      <van-nav-bar title="登录/注册">
        <van-icon name="cross" slot="left" @click="$store.openSignin(false)" />
      </van-nav-bar>
      <van-cell-group>
        <van-field v-model="name" required clearable label="用户名" placeholder="请输入用户名" :error-message="nameErrmsg" />
        <van-field v-model="password" type="password" label="密码" placeholder="请输入密码" required
          :error-message="passwordErrmsg" />
        <van-button type="primary" size="large" @click="signin"> 登录 </van-button>
      </van-cell-group>
    </van-popup>
  </div>
</template>

<script>
  export default {
    data() {
      return {
        name: '',
        password: '',
        nameErrmsg: '',
        passwordErrmsg: ''
      }
    },
    methods: {
      signin() {
        if (this.name == '') {
          this.nameErrmsg = '用户名不能为空'
          return
        } else {
          this.nameErrmsg = ''
        }
        if (this.password == '') {
          this.passwordErrmsg = '密码不能为空'
          return
        } else {
          this.passwordErrmsg = ''
        }
        this.$axios.post('/user/signin', {
          name: this.name,
          password: this.password
        }).then(res => {
          this.passwordErrmsg = ''
          if (res.errcode == 0) {
            //console.log(res.data)
            this.$store.user = res.data
            for (let i = 0; i < this.$store.user.addressList.length; i++) {
              this.$store.user.addressList[i] = this.combineAddress(this.$store.user.addressList[i])
            }
            this.$store.openSignin(false)
            localStorage.token = res.data.token
            this.name = ''
            this.password = ''
          } else if (res.errcode == 90102) {
            this.passwordErrmsg = res.errmsg
          }
        })
      }
    },
  };
</script>

<style>
  * {
    margin: 0;
    padding: 0;
    box-sizing: border-box;
  }

  .clear {
    clear: both;
  }

  .signin-popup {
    height: 100%;
  }

  .red .van-goods-action-icon__icon {
    color: red;
  }

  .cartList .van-checkbox__label {
    margin-left: 8px;
    color: #323233;
    line-height: 20px;
    width: 100%;
  }

  .checkList .van-cell__title {
    flex: 3;
  }
</style>